// packageA/roomDetail/roomDetail.js
//在使用的View中引入WxParse模块
var WxParse = require('../../wxParse/wxParse');
Page({

    /**
     * 页面的初始数据
     */
    data: {
        navBarHeight: 0,
        tabBarHeight: 0,
        contentHeight: 0,
        showLoginPopup: false,
        facilityList: [
            {
                name: '空调'
            },
            {
                name: '窗户'
            },
            {
                name: '独立卫浴'
            },
            {
                name: '无线网络'
            },
            {
                name: '智能门锁'
            },
            {
                name: '电视'
            },
        ],
        list: [
            {
                name: '便利设施',
                description: '房间内高速上网，遮光窗帘，地暖，空调，沙发，衣柜，茶几，餐桌，洗衣机衣架，地毯，床头柜，雨伞'
            },
            {
                name: '食品饮品',
                description: '房间内高速上网，遮光窗帘，地暖，空调，沙发，衣柜，茶几，餐桌，洗衣机衣架，地毯，床头柜，雨伞'
            },
            {
                name: '儿童设施',
                description: '房间内高速上网，遮光窗帘，地暖，空调，沙发，衣柜，茶几，餐桌，洗衣机衣架，地毯，床头柜，雨伞'
            },
            {
                name: '室外景观',
                description: '海景'
            }
        ],
        richTextContent: `<div>
            <p>民宿退订规则:</p>
            <p style="margin-bottom: 15px;">距离入住日期5天以上(不含5天)可以免费取消预定或者延期。距离入住日期5天以内取消的，扣除订单第一晚房费作为违约金。</p>
            
            <p>宠物政策：</p>
            <p>分享时机，在不同的时机分析用户是否有分享的意愿，提供给他们合适的分享内容，能让分享的效果更好。</p>
            <p style="margin-bottom: 15px;">用户主动点击分享 绝大多数APP都是在详情页等需要分享的页面放置一个分享按钮，由用户自行选择分享。这种情况下用户是否分享主要是取决于产品内容本身，比如内容有趣或是有用。在一些APP中设计者会对这个分享按钮加一些鼓励的文案或着重的设计来促进用户分享。</p>
            
            <p>所以监听用户的截图操作，提示用户进行分享，既缩短了以前分享截图的操作路径，避免了在之前长路径中的行为流失（比如截图完成后忘记分享或觉得麻烦放弃分享等等），也让用户觉得更加贴心。</p>
            <p>下面我们会从不同维度来分析一下APP的社交分享功能设计，看看这里面有哪些值得探讨之处。</p>
            <p style="margin-bottom: 15px;">作为用户和产品之间的桥梁，社交分享在产品的发展过程中扮演了重要的角色。</p>
            
            <p>我们从分享时机、分享形式、分享动机、分享场景4个维度来聊聊「社交分享」的那些事儿。</p>
            <p>尤其...</p>
            </p>
        </div>`
    },

    /**
     * 生命周期函数--监听页面加载
     */
    onLoad(options) {
        // 计算剩余可视高度
        this.calculateContentHeight();

        var that = this;
        WxParse.wxParse('article', 'html', that.data.richTextContent, that, 5);
    },
    /**
   * 计算主要内容区域的高度
   */
    calculateContentHeight() {
        const systemInfo = wx.getWindowInfo();
        const windowHeight = systemInfo.windowHeight;
        const safeAreaBottom = systemInfo.safeArea ? systemInfo.screenHeight - systemInfo.safeArea.bottom : 0;
        const tabBarHeight = 50 + safeAreaBottom; // 自定义tabbar高度(100rpx转px约50px) + 安全区域
        
        // 首页导航栏不占用空间，所以内容高度就是窗口高度减去tabbar高度
        const contentHeight = windowHeight;
        
        this.setData({
            tabBarHeight: tabBarHeight,
            contentHeight: contentHeight
        });
    },

    // 统一登录判断
    ensureLogin() {
        const app = getApp()
        const isLogin = app?.globalData?.token || wx.getStorageSync('token')
        if (!isLogin) {
            this.setData({ showLoginPopup: true })
            return false
        }
        return true
    },

    // 关闭登录弹窗
    onCloseLoginPopup() {
        this.setData({ showLoginPopup: false })
    },

    // 登录成功回调
    onLoginSuccess(e) {
        this.setData({ showLoginPopup: false })
        // 登录完成后继续预订流程
        this._goToBook()
    },

    // 预订按钮点击事件（带登录判断）
    goToBookPage(){
        if (!this.ensureLogin()) return
        this._goToBook()
    },

    // 实际跳转预订页逻辑
    _goToBook(){
        // 构造房间数据
        const roomData = {
            name: '山居民宿-花满厅室',
            description: '3卧室·4床·可住5人',
            tips: '2号院2房包院',
            price: 299, // 每晚价格
            images: ['https://example.com/room1.jpg'], // 房间图片
            facilities: this.data.facilityList
        };

        wx.navigateTo({
            url: `/packageA/book/book?roomData=${encodeURIComponent(JSON.stringify(roomData))}`
        });
    },

    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady() {

    },

    /**
     * 生命周期函数--监听页面显示
     */
    onShow() {

    },

    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide() {

    },

    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload() {

    },

    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh() {

    },

    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom() {

    },

    /**
     * 用户点击右上角分享
     */
    onShareAppMessage() {

    }
})